import ProList from '@ant-design/pro-list';
import ProCard from '@ant-design/pro-card';
import Paragraph from 'antd/lib/typography/Paragraph';
import { Tag } from 'antd';
import { Link } from 'umi';


const clickUrl = (url) => {
  //window.location.href = url
  window.open(url)

};
const OpinionTable = ({ newsList }) => {
  return (
    <ProList
      bodyStyle={{ padding: 0 }}
      dataSource={newsList}
      metas={{
        title: {
          render: (_, row) => {
            return (
              <div style={{ width: '100%' }}>
                <div
                  style={{
                    textOverflow: 'ellipsis',
                    whiteSpace: 'normal',

                    display: 'inline-block',
                    marginRight: '0rem',
                  }}
                >
                  {/* <Link
                    style={{ float: 'right', margin: 0, padding: 0 }}
                    to={{
                      pathname: '/OpinionDetail',
                      state: { text: row },
                    }}
                  >
                    查看详情
                  </Link> */}
                  <Tag color={row?.sentiment === '正面' ? '#87d068' : row?.sentiment === '负面' ? '#cd201f' : row?.sentiment === '中性' ? '#ff9800' : ''}>{row?.sentiment}</Tag>
                  <b width={'25vw'} onClick={clickUrl.bind(this, row?.url)}>{row?.title}
                  </b>

                </div>
              </div >
            );
          },
        },
        description: {
          render: (_, row) => {
            let dom = row.keywords?.map((item, index) => {
              return <Tag>{item}</Tag>
            })

            return (
              <>
                <ProCard direction="column" ghost bodyStyle={{ padding: 0 }}>
                  <div
                    style={{
                      display: 'flex',
                    }}
                  >
                    <span
                      style={{
                        color: row?.sentiment === '正面' ? '#87d068' : row?.sentiment === '负面' ? '#cd201f' : row.sentiment === '中性' ? '#ff9800' : '',
                        width: '3.75rem',
                        fontFamily: 'Microsoft YaHei',
                        fontWeight: '700',
                        fontSize: '16px',
                        lineHeight: '24px',
                      }}
                    >
                      {Number(row?.score).toFixed(3)}
                    </span>
                    <Paragraph ellipsis={{
                      rows: 2
                    }} style={{ width: '42rem' }} >
                      {/* 正文描述 */}
                      {/* {row.paragraphs[0].text} */}
                      {row?.content}
                    </Paragraph>
                  </div>

                  <div>

                    {/* <Tag >{row.f002v}</Tag> */}
                    {dom}
                    <span style={{ float: 'right', color: '#b2a6a6' }}>{row?.source} | {row?.datetime.split('T')[0]}</span>
                    {/* <span style={{ float: 'right' }}>{row?.rectime}</span> */}
                  </div>
                </ProCard>
              </>
            );
          },
        },
      }}
      pagination={{
        defaultPageSize: 6,
      }}
    />
  );
};

export default OpinionTable;
